<!-- 维修单详情弹窗 -->
<template>
  <a-form
    ref="form3"
    class="ele-form-detail"
    :model="repairOrderModalApp.repairOrder"
    :label-col="{md: {span: 2}, sm: {span: 4}, xs: {span: 6}}"
    :wrapper-col="{md: {span: 22}, sm: {span: 20}, xs: {span: 18}}">
    <a-descriptions :title="repairOrderModalApp.title" bordered>
      <!--                                    <a-descriptions-item label="标识">-->
      <!--                        {{ repairOrderModalApp.repairOrder.Eid }}-->
      <!--                    </a-descriptions-item>-->
      <!--                                    <a-descriptions-item label="创建人">-->
      <!--                        {{ repairOrderModalApp.repairOrder.creatorName }}-->
      <!--                    </a-descriptions-item>-->
      <!--                                    <a-descriptions-item label="名称">-->
      <!--                        {{ repairOrderModalApp.repairOrder.name }}-->
      <!--                    </a-descriptions-item>-->
      <a-descriptions-item label="学校">
        {{ repairOrderModalApp.repairOrder.school }}
      </a-descriptions-item>
      <a-descriptions-item label="报修区域">
        {{ repairOrderModalApp.repairOrder.repairArea }}
      </a-descriptions-item>
      <a-descriptions-item label="详细位置">
        {{ repairOrderModalApp.repairOrder.detailedLocation }}
      </a-descriptions-item>
      <a-descriptions-item label="故障类型">
        {{ repairOrderModalApp.repairOrder.faultType }}
      </a-descriptions-item>
      <a-descriptions-item label="报修人">
        {{ repairOrderModalApp.repairOrder.repairApplicantName }}
      </a-descriptions-item>
      <a-descriptions-item label="性别">
        {{ repairOrderModalApp.repairOrder.repairApplicantPhone }}
      </a-descriptions-item>
      <a-descriptions-item label="预期上门维修时间">
        {{ repairOrderModalApp.repairOrder.expectRepairTime }}
      </a-descriptions-item>
      <a-descriptions-item label="上门维修时间">
        {{ repairOrderModalApp.repairOrder.repairTime }}
      </a-descriptions-item>
      <a-descriptions-item label="故障图片">
        {{ repairOrderModalApp.repairOrder.faultPicture }}
      </a-descriptions-item>
      <a-descriptions-item label="维修级别">
        {{ repairOrderModalApp.repairOrder.repairLevel }}
      </a-descriptions-item>
<!--      <a-descriptions-item label="当前状态编号">-->
<!--        {{ repairOrderModalApp.repairOrder.currentState }}-->
<!--      </a-descriptions-item>-->
      <a-descriptions-item label="状态">
        {{ repairOrderModalApp.repairOrder.status }}
      </a-descriptions-item>
<!--      <a-descriptions-item label="创建人ID">-->
<!--        {{ repairOrderModalApp.repairOrder.creatorId }}-->
<!--      </a-descriptions-item>-->
      <a-descriptions-item label="故障描述">
        {{ repairOrderModalApp.repairOrder.remark }}
      </a-descriptions-item>
      <a-descriptions-item label="创建时间">
        {{ repairOrderModalApp.repairOrder.createDatetime }}
      </a-descriptions-item>
    </a-descriptions>
  </a-form>
</template>

<script>
import {defineComponent, reactive, onMounted, inject} from "vue";
import {useRoute} from "vue-router"
import {RepairOrderService} from "@/views/repair/repairManagement/repairOrder/repairOrderService";

export default defineComponent({
  setup() {
    const route = useRoute();
    let routeId = route.params.id;
    let repairOrderListApp = inject('repairOrderListApp', reactive({}));
    const repairOrderModalApp = reactive({id: null, repairOrder: {}, display: false});

    onMounted(() => {
      repairOrderModalApp.repairOrder = {};
      if (routeId) {
        repairOrderModalApp.id = routeId;
      } else if (repairOrderListApp.viewModalShowing) {
        repairOrderModalApp.id = repairOrderListApp.currentId;
        repairOrderModalApp.display = true;
      }
      if (repairOrderModalApp.id) {
        getInfo(repairOrderModalApp.id);
      }
    })

    const getInfo = (id) => {
      RepairOrderService.findRepairOrder(id).then((res) => {
        repairOrderModalApp.repairOrder = res.data;
        repairOrderModalApp.title = "查看 " + repairOrderModalApp.repairOrder.name;
      })
    }

    return {
      repairOrderModalApp,
      routeId,
      getInfo,
    }
  }
})
</script>

<style scoped>
</style>

